/**
 * Created by bobby on 2016/3/10.
 */
var setting = {
    view: {
        addHoverDom: addHoverDom,
        removeHoverDom: removeHoverDom,
        selectedMulti: false
    },
    check: {
        enable: true
    },
    data: {
        simpleData: {
            enable: true
        }
    },
    callback: {
        onDrop: dropNode
    },
    edit: {
        enable: true
    }
};

var zNodes =[
    { id:"000", pId:-1, name:"试点矿区", open:true},
    { id:"001", pId:"000", name:"基站001"},
    { id:"001001", pId:"001", name:"传感器001001"},
    { id:"001002", pId:"001", name:"传感器001002"},
    { id:"001003", pId:"001", name:"传感器001003"},
    { id:"001004", pId:"001", name:"传感器001004"},
    { id:"002", pId:"000", name:"基站002"},
    { id:"002001", pId:"002", name:"传感器002001"},
    { id:"002002", pId:"002", name:"传感器002002"},
    { id:"002003", pId:"002", name:"传感器002003"},
    { id:"002004", pId:"002", name:"传感器002004"},
    { id:"003", pId:1, name:"基站003"},
    { id:"003001", pId:"003", name:"传感器003001"},
    { id:"003002", pId:"003", name:"传感器003002"},
    { id:"003003", pId:"003", name:"传感器003003"},
    { id:"003004", pId:"003", name:"传感器003004"},
    { id:"004", pId:1, name:"基站004", isParent:true}
];

var newCount = 1;
function addHoverDom(treeId, treeNode) {
    var sObj = $("#" + treeNode.tId + "_span");
    if (treeNode.editNameFlag || $("#addBtn_"+treeNode.tId).length>0) return;
    var addStr = "<span class='button add' id='addBtn_" + treeNode.tId
        + "' title='add node' onfocus='this.blur();'></span>";
    sObj.after(addStr);
    var btn = $("#addBtn_"+treeNode.tId);
    if (btn) btn.bind("click", function(){
        var zTree = $.fn.zTree.getZTreeObj("treeDemo");
        zTree.addNodes(treeNode, {id:(100 + newCount), pId:treeNode.id, name:"new node" + (newCount++)});
        return false;
    });
};
function removeHoverDom(treeId, treeNode) {
    $("#addBtn_"+treeNode.tId).unbind().remove();
};

/**
 * 初始化viewbox容器
 * @param viewbox
 */
function drawInitial(viewbox) {
    viewbox.configure({viewBox: '0 0 1280 960'}, true);
}

/**
 * 设置viewbox的背景图片
 * @param viewbox
 * @param path
 */
function setViewboxBackgroud(viewbox,path){
    viewbox.image(0,0,1280,960, '../images/jxgwt.jpg');
}

/**
 *
 * @param viewbox
 * @param text
 */
function setLeaf(viewbox,text,x,y){
    var group = viewbox.group({stroke: 'black', strokeWidth: 2});
    viewbox.circle(x, y, 24, {fill: 'none', stroke: 'red', strokeWidth: 3});
    viewbox.text(group,x-20,y+5,"GAS",{stroke: 'red'});
    viewbox.text(group,x+20,y+5,text,{stroke: 'red', fill:'red',size:'18pt'});
}

/**
 *
 * @param viewbox
 * @param text
function setTrunk(viewbox,text,x,y){
    var group = viewbox.group({stroke: 'black', strokeWidth: 2});
    viewbox.circle(x, y, 24, {fill: 'none', stroke: 'red', strokeWidth: 3});
    viewbox.text(group,x-20,y+5,"GAS",{stroke: 'red'});
    viewbox.text(group,x+20,y+5,text,{stroke: 'red', fill:'red',size:'18pt'});
}
*/

function dropNode(event,treeId,treeNodes,targetNode,moveType,isCopy){
    console.log(event);
    console.log("{"+event.pageX+","+event.pageY+"}");

    var viewbox = $('#viewport').svg("get");
    setLeaf(viewbox,"001001",event.pageX,event.pageY);
}

$(document).ready(function(){

    $.fn.zTree.init($("#treeDemo"), setting, zNodes);

    $('#viewport').svg({onLoad: drawInitial});

    var viewbox = $('#viewport').svg("get");//获取创建的SVG容器
    setViewboxBackgroud(viewbox,'../images/jxgwt.jpg');
    setLeaf(viewbox,"起始",0,0);

});